<!DOCTYPE html>
<html>
<head>
  <title>最省时间路线</title>
  <meta charset="UTF-8">
  <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  <script src="/static/js/cityAndPro.js"></script>
  <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="/static/css/full.css" rel="stylesheet" type="text/css"/>
</head>
<body>

<div class="header">
  <h1>基于Djando的混合式路线规划系统</h1>
  <p>最省时间路线</p>
</div>

<div id="daohang" class="navbar">
  <a href="index.html">主页</a>
  <a href="test1.html">最省钱路线</a>
  <a href="test2.html">最省时间路线</a>
  <a href="https://www.12306.cn/index/" class="right">12306官方网站</a>
</div>

<div class="main">
  <form action="/search">
    <div class="form-group">
      <label class="control-label col-sm-3">出发地</label>
      <div class="col-sm-8">
        <div class="col-sm-4">
          <select name="input_province" id="input_province" class="form-control">
            <option value="">--请选择--</option>
          </select>
        </div>
        <div class="col-sm-4">
          <select name="input_city" id="input_city" class="form-control">
            <option value="">--请选择--</option>
          </select>
        </div>
      </div>
    </div>
    <script>
      $(function() {
        var html = "";
        var province_idx;
        $("#input_city").append(html);

        $.each(cityMessage, function(idx, item) {
          if(item.parid == '1'){
            html += "<option value='" + item.regname + "' exid='" + item.regid + "'>" + item.regname + "</option>";
          }

        });
        $("#input_province").append(html);
        $("#input_province").change(function(e) {
          var province =$(this).val();
          var cityList = [];
          if(province == "") return;
          $("#input_city option").remove();
          var html = "<option value=''>--请选择--</option>";

          $.each(cityMessage, function(idx, item) {
            if(province == item.regname && item.parid == '1') {
              province_idx=idx
            }
          })

          $.each(cityMessage, function(idx, item) {
            if(cityMessage[idx].parid == cityMessage[province_idx].regid) {
              cityList.push(cityMessage[idx])
            }
          })

          if(cityList instanceof Array && cityList.length>0){
            $.each(cityList, function(idx, item) {
              console.log(item)
              html += "<option value='" + item.regname + "' exid='" + item.regid + "'>" + item.regname + "</option>";

            });
          }else{
            html += "<option value='" + cityMessage[province_idx].regname + "' exid='" + cityMessage[province_idx].regid + "'>" + cityMessage[province_idx].regname + "</option>";

          }
          $("#input_city").append(html);
        });
      });
    </script>
</div>
<br><br><br><br><br>
<div class="main">
  <div class="form-group">
    <label class="control-label col-sm-3">目的地</label>
    <div class="col-sm-8">
      <div class="col-sm-4">
        <select name="input_province1" id="input_province1" class="form-control">
          <option value="">--请选择--</option>
        </select>
      </div>
      <div class="col-sm-4">
        <select name="input_city1" id="input_city1" class="form-control">
          <option value="">--请选择--</option>
        </select>
      </div>
    </div>
  </div>
  <br><br><br><br><br>
  <div class="form-group">
    <label class="control-label col-sm-3">日期</label>
    &emsp;&emsp;&ensp;<input type="date" name="date">
  </div>
  <script>
    $(function() {
      var html = "";
      var province_idx;
      $("#input_city1").append(html);

      $.each(cityMessage, function(idx, item) {
        if(item.parid == '1'){
          html += "<option value='" + item.regname + "' exid='" + item.regid + "'>" + item.regname + "</option>";
        }

      });
      $("#input_province1").append(html);
      $("#input_province1").change(function(e) {
        var province =$(this).val();
        var cityList = [];
        if(province == "") return;
        $("#input_city1 option").remove();
        var html = "<option value=''>--请选择--</option>";

        $.each(cityMessage, function(idx, item) {
          if(province == item.regname && item.parid == '1') {
            province_idx=idx
          }
        })

        $.each(cityMessage, function(idx, item) {
          if(cityMessage[idx].parid == cityMessage[province_idx].regid) {
            cityList.push(cityMessage[idx])
          }
        })

        if(cityList instanceof Array && cityList.length>0){
          $.each(cityList, function(idx, item) {
            console.log(item)
            html += "<option value='" + item.regname + "' exid='" + item.regid + "'>" + item.regname + "</option>";

          });
        }else{
          html += "<option value='" + cityMessage[province_idx].regname + "' exid='" + cityMessage[province_idx].regid + "'>" + cityMessage[province_idx].regname + "</option>";

        }
        $("#input_city1").append(html);
      });
    });
  </script>
  <br><br><br>
  &ensp;<input type="submit" value="提交">
  </form>
</div>
<br><br><br><br><br><br>
<div class="footer">
  <h4>版权声明：本站数据来自12306官方网站</h4>
  <p>校创成员：范剑桥、黄运奥、王天同、谢维倪、孔然瑶</p>
</div>
</body>
</html>